import Vue from 'vue'
import Router from 'vue-router'
import Head from'@/components/Head'
import Foot from '@/components/Foot'

const Home      = () => import(/*webpackChunkName: "home",*/ './views/Home'),
      Detail    = () => import(/*webpackChunkName: "detail",*/ './views/Detail'),
      Classify  = () => import(/*webpackChunkName: "classify",*/ './views/Classify'),
      Ranking   = () => import(/*webpackChunkName: "ranking",*/ './views/Ranking'),
      Search    = () => import(/*webpackChunkName: "search",*/ './views/Search'),
      Sign      = () => import(/*webpackChunkName: "sign",*/ './views/Sign'),
      Download  = () => import(/*webpackChunkName: "download",*/ './views/Download'),
      ServeDet  = () => import(/*webpackChunkName: "servedet",*/ './views/ServeDet'),
      Notice    = () => import(/*webpackChunkName: "notice",*/ './views/Notice'),
      NoticeDet = () => import(/*webpackChunkName: "noticedet",*/ './views/NoticeDet');
/*import Home from './views/Home'
import Classify from './views/Classify'
import Ranking from './views/Ranking'
import Search from './views/Search'
import Sign from './views/Sign'
import Download from './views/Download'
import ServeDet from './views/ServeDet'
import Notice from './views/Notice'
import NoticeDet from './views/NoticeDet'
import Detail from'./views/Detail'*/

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'home',
      meta:{index:0,backTitle:'首页'},
      components:{
        body:Home,
        foot:Foot
      } 
    },
    {
      path: '/classify/:type',
      name: 'classify',
      meta:{index:1,backTitle:'分类'},
      components:{
        body:Classify,
        foot:Foot
      } 
    },
    {
      path: '/ranking',
      name: 'ranking',
      meta:{index:2,backTitle:'排行榜'},
      components:{
        body:Ranking,
        foot:Foot
      } 
    },
    {
      path: '/search',
      name: 'search',
      meta:{title:'游戏搜索',backTitle:'搜索'},
      components:{
        body:Search
      } 
    },
    {
      path: '/sign/:code',
      name: 'sign',
      components:{
        body:Sign
      } 
    },
    {
      path: '/download',
      name: 'download',
      meta:{isBg:true},
      components:{
        body:Download
      } 
    },
    {
      path: '/sermore',
      name: 'sermore',
      meta:{backTitle:'开服'},
      components:{
        //head:Head,
        body:ServeDet
      } 
    },
    {
      path: '/notice',
      name: 'notice',
      meta:{title:'狐玩公告'},
      components:  {
        head:Head,
        body:Notice
      },
      children: [  
        { 
          name: "noticeDet",
          meta:{title:'公告详情'},
          path: "/notice/:id",
          component:NoticeDet
        }  
      ]
    },
    {
      path: '/detail/:id',
      meta:{title:'游戏详情'},
      name: 'detail',
      // route level code-splitting
      // this generates a separate chunk (about.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      components:{
        //head:Head,
        body:Detail
      } //() => import(/* webpackChunkName: "about" */ './views/Detail')
    }
  ],
  scrollBehavior(to,form,savedPosition){
    //scrollBehavior方法接收to，form路由对象
    //第三个参数savedPosition当且仅当在浏览器前进后退按钮触发时才可用
    //该方法会返回滚动位置的对象信息，如果返回false，或者是一个空的对象，那么不会发生滚动
    //我们可以在该方法中设置返回值来指定页面的滚动位置，例如：
    return {x:0,y:0}
    //表示在用户切换路由时让是所有页面都返回到顶部位置
    //如果返回savedPosition,那么在点击后退按钮时就会表现的像原生浏览器一样，返回的页面会滚动过到之前按钮点击跳转的位置，大概写法如下：
    if(savedPosition){
        return savedPosition
    }else{
      return {x:0,y:0}
      //console.log('回到顶部')
    }
    //如果想要模拟滚动到锚点的行为:
    if(to.hash){
      return {
        selector:to.hash
      }
    }
  }
})
